<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>WebSocket 客户端</title>

<script src="js/ws.js" type="text/javascript"></script>
<script src="js/PacketType.js" type="text/javascript"></script>
<script type="text/javascript">
	ws.init({
		url : "localhost:8989/ws"
	}).connect();

	//当有消息过来的时候触发
	ws.onmessage = function(event) {
		var resp = JSON.parse(event.data)
		var respMessage = document.getElementById("respMessage");
		respMessage.value = respMessage.value + "\n" + resp.msg;
		
		PacketType.handle(resp.id, resp.msg)
	}

	//连接关闭的时候触发
	ws.onclose = function(event) {
		var respMessage = document.getElementById("respMessage");
		respMessage.value = respMessage.value + "\n断开连接";
	}

	//连接打开的时候触发
	ws.onopen = function(event) {
		var respMessage = document.getElementById("respMessage");
		respMessage.value = "建立连接";
	}

	function sendMsg(msg) { //发送消息 
		if (window.WebSocket) {
			var msg = {
				playerId : 1
			};
			ws.send(PacketType.ReqPlayerLogin, msg);
		}
	}
</script>
</head>
<body>
	<form onsubmit="return false">
		<textarea style="width: 300px; height: 200px;" name="message"></textarea>
		<input type="button" onclick="sendMsg(this.form.message.value)"
			value="发送"><br>
		<h3>信息</h3>
		<textarea style="width: 300px; height: 200px;" id="respMessage"></textarea>
		<input type="button" value="清空"
			onclick="javascript:document.getElementById('respMessage').value = ''">
	</form>
</body>
</html>